Instructive Form
__NOEDITSECTION__ Summary An Instructive Form is an online WYSIWYG editor that displays a web page with fields the user can edit, but is read-only for the remainder. If a field gets the focus, context sensitive instructions and buttons appear to help the user editing the field with the focus by providing things like: field definitions, and style rules, validation results and action buttons for this field. Introduction Many new users find it difficult to fill in a template, mainly because they don't know what data to fill in at which parameter and how to format that data. Many wikis try to solve the problem by writing comprehensive help pages, style guides, editing guidelines and such. Writing these documents rarely help the new user mainly because he is overwhelmed by the amount of information and can't remember the relevant documentation when needed. Vision A piece of data, and the rules & tools for that data form one functional unit. This is true for a piece of data as small as a field, as large as a website, and anything in between. When we're looking at a piece of data, we see the (most important) data and the (most important) rules & tools for that data in one page, without scrolling. We call this combination of data, tools and rules an Instructive Field, Instructive Form etc. Using Instructive components makes: * learning a wiki a lot easier, because we can start small, with a few data fields, learning a few rules and tools, and gradually extend our knowledge. * maintaining the wiki more fun and more interesting. More fun because we can stop writing comprehensive style guides and then still get questions about things that are clearly explained in the documentation; more interesting because we are challenged to structure documentation, the tooling and the data in the same way. The form view A classic wiki page has two views: the read only page we see when we open the page with a browser, and the source file we see when we click the edit button. An Instructive Form has three views: the read only page we see when we open the page with a browser, the form we see when we click the edit button, and the source file we see when we click the display source button. How does it work? 1 2 3 4 Reference if-editable if-instruction src template Examples To do: add a screenshot of each of these views. Use a telephone list form as an example. An entry per row, per entry a first name, last name and a telephone number. Telephone numbers shall be 4 digits. A sort button sorts the list on last name. Releases Version Dependencies Notes version 1 none Development This is the development version. ---- old: The Editing Assistant is an add-on for MediaWiki that can replace the area of the default page editor that normally displays the source text by a WYSIWYG editor. The Editing Assistant script scans every page that is loaded and ignores every page except when: * the url ends on ?action=edit. * the page contains and element with id "wpTextbox1". * that element has a value that starts with ". When the Editing Assistant reacts it parses the source file and displays its content. << Begin | Value | Instruction | Options >> Begin: the type of control, example h2, p etc. Style: CSS style of this control. Value: The value of the control. The user can edit this value. Instruction: Displayed when the user edits this control's value; hidden otherwise. Options: ?Additional configuration parameters. Design The Form Wizard reacts on all elements with a class attribute equal to "Wizard Form". The Form Wizard reacts on an element by reading its inner HTML (= source) and replacing it with HTML the Wizard generates (= result). The Form Wizard result is equal to the source, except that the Wizard tags in the source are replaced by the rendered version of the Wizard tags in the result. A Wizard tag begins with "<<" and ends with ">>". Example Ingredients < > |